<template>
	<view class="padding">
		<view class="flex">
			<image style="width: 50px;height: 50px;" mode="aspectFill" :src="sku.img"></image>
			<view class="margin-left">
				<view class="padding-bottom-sm">{{sku.name}}</view>
				<text @tap="clickStar(n+1)" class="cuIcon-favorfill text-red text-lg margin-top" style="font-size: 20px;margin-right: 3px;"
				 v-for="n in star" :key="n"></text>
				<text @tap="clickStar(n+1+star)" class="cuIcon-favor text-grey text-lg margin-top" style="font-size: 20px;margin-right: 3px;"
				 v-for="n in (5-star)" :key="n"></text>
			</view>
		</view>
		<textarea @input="inputContent" maxlength="512" class="padding-sm margin-top" style="border-radius: 10px;border: 1px solid rgba(0,0,0,0.2);width: 100%;"
		 placeholder="感觉怎么样,跟大家分享一下吧~"></textarea>
		<view class="padding flex flex-direction margin-top">
			<button @tap="save" class="cu-btn bg-black lg">提交</button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				sku: {},
				content: '',
				star: 5
			}
		},
		onLoad() {
			var that = this;
			uni.getStorage({
				key: 'commentSku',
				success: function(res) {
					console.log(res)
					that.sku = res.data;
				}
			})
		},
		onUnload() {
			uni.removeStorage({
				key: 'commentSku'
			})
		},
		methods: {
			clickStar(n) {
				console.log(n)
				this.star = n;
			},
			inputContent(e) {
				this.content = e.detail.value;
			},
			save() {
				if (this.content == '') {
					uni.showToast({
						icon: 'none',
						title: '请填写评论内容'
					})
					return;
				}
				this.$get('mall/comment/add', {
					orderno: this.sku.orderno,
					skuId:this.sku.skuId,
					star: this.star,
					content:this.content
				}, 'post', true).then((res) => {
					if (res.data) {
						uni.showToast({
							icon: 'none',
							title: '已评论',
							success:function() {
								setTimeout(function(){
									uni.navigateBack({
										delta:1
									})
								},1000)
							}
						})
					}
				})
			}
		}
	}
</script>

<style>
</style>
